<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=EUC-KR">
<title>주문상세리스트</title>
<script src="http://code.jquery.com/jquery-1.11.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
	var param = "";
	var params = new Array();
	var pageno = ""; 
	var pagetype = "";
	
	if(location.search){ // URL에 parameter가 존재하는 경우
		param = location.search.split("?")[1]; // 파라미터 부분 분리
		params = param.split("&");

		pageno = params[0].split("=")[1];
		pagetype = params[1].split("=")[1];
	}
	else{ // URL에 parameter가 존재하지 않는 경우
		pageno = "1";
		pagetype = "all";
	}
	
	$.getJSON('odetailListJSON', // JSON 요청 시작...이 또한 컨트롤러 타고 들어감
			{pageno : pageno, pagetype : pagetype}, // 전달할 데이터 등록 
			function(odetailJsonArray){ // callback 함수 작성, 응답으로 받은 데이터 이름은 boardJsonArray
				var html = ""; // html문 작성 
				
				html += "<table>";
				html += "<tr>";
				html += "<td>주문번호</td>";
				html += "<td>상세번호</td>";
				html += "<td>상품번호</td>";
				html += "<td>수량</td>";
				html += "</tr>";
				
				$.each(odetailJsonArray, function(index, odetailJson){ // Json배열 순회하며 html문 작성
					// JSON데이터 처리의 jQuery.each( collection, callback(indexInArray, valueOfElement) )
					// collection : 응답으로 전달받은 JSON data
					// callback(indexInArray, valueOfElement) : 실행되는 함수
					// indexInArray : JSON data Array의 index
					// valueOfElement : JSOn data Array의 data
					
					html += "<tr>";
					html += "<td>" + odetailJson.odetail_ordersno + "</td>";
					html += "<td><a href='odetailview?odetailno=" + odetailJson.odetail_no + "'>" + odetailJson.odetail_no + "</td>";
					html += "<td>" + odetailJson.odetail_product + "</td>";
					html += "<td>" + odetailJson.odetail_count + "</td>";
					html += "</tr>";						
				});
				
				html += "</table>";
				
				$('#odetail_list').html(html); // id가 board_list인 요소에 html문 삽입
			}
		 );
	
});
</script>
</head>
<body>
<div id="odetail_list"></div>
<br/>
</body>
</html>